new Vue({
    el: "#mainContent",
    data: {
        name: '',
        firstMenuList: [],//一级菜单
        secondMenuList: [],//二级菜单
        videoList: [],//视频
        //FIXME 待合并
        getFirstMenuList: "/index/get_first_menu.ajax",
        getSecondMenuList: "/index/get_second_menu.ajax",
        getMenuList: "/video/get_video_list.ajax",
        videoDetailUrl: "/video/detail",
        pageNum: 1,
        firstMenuId: "",
        secondMenuId: "",
        cardIndexUrl: "/card/index"
    },
    mounted: function () {
        this.firstMenuId = $("#firstMenuId").val();
        this.secondMenuId = $("#secondMenuId").val();
        this.name = $("#nameUser").val();
        this.initPage();
    }
    ,
    methods: {
        //初始化页面
        initPage: function () {
            //1.加载一级菜单
            this.$http.get(this.getFirstMenuList)
                .then((response) => {
                    this.$set(this, "firstMenuList", response.data.data);
                })
                .catch(function (response) {
                    console.log(response)
                });
            this.listSecondMenu();
            this.listVideo();
        }
        ,
        listVideo: function () {
            //3.加载视频列表
            this.$http.post(this.getMenuList, {
                typeId: this.secondMenuId,
                sortType: 0,
                pageNum: this.pageNum
            }, {emulateJSON: true})
                .then((response) => {
                    this.$set(this, "videoList", response.data.data);
                })
                .catch(function (response) {
                    console.log(response)
                });
        }
        ,
        listSecondMenu: function () {
            //2.加载二级菜单内容
            this.$http.post(this.getSecondMenuList, {firstMenuId: this.firstMenuId}, {emulateJSON: true})
                .then((response) => {
                    console.log(JSON.stringify(response.data));
                    this.$set(this, "secondMenuList", response.data.data);
                })
                .catch(function (response) {
                    console.log(response)
                });
        }
        ,
        checkFirstMenuSelect: function (fMenu) {
            return fMenu.typeId == this.firstMenuId ? "menuSelect" : "";
        }
        ,
        checkSecondMenuSelect: function (sMenu) {
            return sMenu.typeId == this.secondMenuId ? "menuSelect" : "";
        }
        ,
        login: function () {
            layer.open({
                type: 2,
                title: '',
                fix: false,
                maxmin: true,
                shadeClose: true,
                area: ['400px', '300px'],
                content: '/login/login',
            });
        }
        ,
        register: function () {
            layer.open({
                type: 2,
                title: '',
                fix: false,
                area: ['400px', '300px'],
                content: '/login/login',
            });
        }
        ,
        chooseFirstMenu: function (event, fMenu) {
            this.firstMenuId = fMenu.typeId;
            this.listSecondMenu()
        }
        ,
        chooseSecondMenu: function (event, sMenu) {
            this.secondMenuId = sMenu.typeId;
            this.listVideo();
        }
        ,
        jumpToPlay: function (video) {
            window.location.href = this.videoDetailUrl + "?videoId=" + video.videoId;
        },
        jumpToCard: function () {
            window.location.href = this.cardIndexUrl;
        }
    }
})
;